<div id="merchantManagement">
    <yu-panel title="客户建档">
        <yu-xform ref="merchantInfoSearch" related-table-name="merchantTable" form-type="search"
                  :custom-search-fn="searchFn">
            <yu-xform-group :column="3">
                <yu-xform-item label="商户名称" placeholder="商户名称" name="merchantName" ctype="input"></yu-xform-item>
                <yu-xform-item label="联系人" placeholder="联系人" name="contactPerson" ctype="input"></yu-xform-item>
                <yu-xform-item v-if="judgeUser" @change="changeMerchantId" label="归属机构" placeholder="归属机构" :options="options1" ctype="select" name="orgId"></yu-xform-item>
                <yu-xform-item label="归属网格" placeholder="归属网格" ctype="select" :options="options2" name="secondGridId"></yu-xform-item>
            </yu-xform-group>
        </yu-xform>
        <div style="justify-content:space-between;display: flex">
            <div>
<!--                <yu-button type="warning" @click="lookupInformation()" >查询基本信息</yu-button>-->
                <yu-button type="danger" @click="addMerchantFn()" >新增</yu-button>
                <yu-button type="success" @click="getMerchantInformation()" >修改</yu-button>
                <yu-button type="danger" @click="deleteMerchantManagement()" >删除</yu-button>
            </div>
        </div>
        <div style="height: 30px"></div>
        <yu-xtable ref="merchantTable" :base-params="merchantData" :data-url="funcDataUrl" request-type="get" row-number style="width: 100%" selection-type="checkbox">
            <yu-xtable-column prop="merchantName" label="商户名称" width="90px" align="center" show-overflow-tooltip></yu-xtable-column>
            <yu-xtable-column prop="contactPerson" label="联系人" width="130px" align="center" show-overflow-tooltip></yu-xtable-column>
            <yu-xtable-column prop="contactPhone" label="联系电话" width="130px" align="center" show-overflow-tooltip>
                <template slot-scope="scope">
                    {{scope.row.contactPhone? scope.row.contactPhone.replace(/^(.{7})(?:\w+)(.{0})$/,
                    "\$1****\$2"):""}}
                </template>
            </yu-xtable-column>
            <yu-xtable-column prop="businessScope" label="经营内容" width="160px" align="center" show-overflow-tooltip></yu-xtable-column>
            <yu-xtable-column prop="address" label="联系地址" width="120px" align="center" show-overflow-tooltip></yu-xtable-column>
            <yu-xtable-column prop="bizLicNo" label="营业执照" width="120px"  align="center" show-overflow-tooltip></yu-xtable-column>
            <yu-xtable-column prop="contactType" label="联系人类型" width="120px" data-code="CONTACT_TYPE" align="center" show-overflow-tooltip></yu-xtable-column>
        </yu-xtable>
    </yu-panel>
    <!-- 新增客商户弹框-->
    <el-dialog :center="true" title="商户信息" :visible.sync="dialogFormVisible" position="relative" >
        <div style="display: flex;height: auto;position: relative;transition: all .5s;flex-direction: column">
            <yu-xform :disabled="formDisabled" ref="merchantForm"  label-width="110px" :rules="rules" v-model="merchantInfo">
                <yu-xform-group :column="2">
                    <yu-xform-item label="商户名称" placeholder="商户名称"  name="merchantName" ctype="input"></yu-xform-item>
                    <yu-xform-item label="联系人" placeholder="联系人"  name="contactPerson" ctype="input"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="1">
                    <yu-xform-item label="联系电话" placeholder="联系电话" name="contactPhone" ctype="input"></yu-xform-item>
                    <yu-xform-item label="经营内容" placeholder="经营内容" name="businessScope" ctype="input"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="1">
                    <yu-xform-item label="地址" placeholder="地址" name="address" ctype="input"></yu-xform-item>
                    <yu-xform-item label="营业执照" placeholder="请选择" name="bizLicNo" ctype="input" ></yu-xform-item>
                    <yu-xform-item label="证件号码" placeholder="证件号码" name="ctfNo" ctype="input"></yu-xform-item>
                </yu-xform-group>
                <yu-xform-group :column="2">
                    <yu-xform-item label="性别" placeholder="请选择" name="gndrCd" ctype="select" data-code="SEX_TYPE"></yu-xform-item>
                    <yu-xform-item label="联系人类型" placeholder="请选择" name="contactType" ctype="select" data-code="CONTACT_TYPE"></yu-xform-item>
                </yu-xform-group>
            </yu-xform>
            <div slot="footer" class="dialog-footer" align="center">
                <el-button v-if="saveBtnShow" type="primary" @click="saveEditFunc()">保存</el-button>
                <el-button v-if="saveBtnShow" @click="restInputValue()">取消</el-button>
            </div>
        </div>
    </el-dialog>
</div>
